@import "@/static/fonts/iconfont.css";
page {
  /* 定义一些主题色及基础样式 */
  font-family: PingFang SC, Arial, Hiragino Sans GB, Microsoft YaHei, sans-serif;
  font-size: 28rpx;
  color: $-color-normal;
  background-color: #000;
	.container {
		overflow: hidden;
		height: 100vh;
	}
}
/deep/ .uni-scroll-view-refresh-inner > svg {
  fill: #FFB600 !important;
}

/deep/ .uni-scroll-view-refresh__spinner > circle {
  color: #FFB600 !important;
}

.bold {
  font-weight: bold;
}

/* 定义字体颜色 */
.theme-color {
	color: $-color-theme;
}
.black {
  color: $-color-black;
}

.white {
  color: $-color-white;
}

.red {
  color: $-color-red;
}

.blue {
  color: $-color-blue;
}

.green {
  color: $-color-green;
}

.normal {
  color: $-color-normal;
}

.gray {
  color: $-color-gray;
}

.muted {
  color: $-color-muted;
}

.orange {
  color: $-color-orange;
}


// 定义内外边距，历遍1-80
@for $i from 0 through 80 {
  // 只要双数和能被5除尽的数
  @if $i % 2 == 0 or $i % 5 == 0 {
    // 如：m-30
    .m-#{$i} {
      margin: $i + rpx;
    }

    // 如：p-30
    .p-#{$i} {
      padding: $i + rpx;
    }

    @each $short, $long in l left, t top, r right, b bottom {
      //结果如： m-l-30
      // 定义外边距
      .m#{$short}-#{$i} {
        margin-#{$long}: $i + rpx;
      }

      // 定义内边距
      //结果如： p-l-30
      .p#{$short}-#{$i} {
        padding-#{$long}: $i + rpx;
      }
    }
  }
}

.inline {
  display: inline-block;
}

/* 定义常用的弹性布局 */
.flex {
  /* #ifndef APP-NVUE */
  display: flex;
  /* #endif */
  flex-direction: row;
  align-items: center;
}

.flex-wrap {
  flex-wrap: wrap;
}

.flex-nowrap {
  flex-wrap: nowrap;
}

.col-baseline {
  align-items: baseline;
}

.col-center {
  align-items: center;
}

.col-inherit {
  align-items: inherit;
}

.col-top {
  align-items: flex-start;
}

.col-end {
  align-items: end;
}

.col-bottom {
  align-items: flex-end;
}

.col-stretch {
  align-items: stretch;
}

.col-between {
  align-content: space-between
}

.row-center {
  justify-content: center;
}

.row-left {
  justify-content: flex-start;
}

.row-right {
  justify-content: flex-end;
}

.row-between {
  justify-content: space-between;
}

.row-around {
  justify-content: space-around;
}

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

.flex-col {
  /* #ifndef APP-NVUE */
  display: flex;
  /* #endif */
  flex-direction: column;
}

.flex-1 {
	flex: 1;
}

.flex-none {
  flex: none;
}

// 定义字体大小，12-48的字体
@for $i from 12 through 48 {
  @if $i % 2 == 0 {
    .fz-#{$i} {
      font-size: $i + rpx;
    }
  }
}


/* 超出隐藏 */
/* start--文本行数限制--start */
.line-1 {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.line-2 {
  -webkit-line-clamp: 2;
}

.line-3 {
  -webkit-line-clamp: 3;
}

.line-2, .line-3 {
  overflow: hidden;
  word-break: break-all;
  text-overflow: ellipsis;
  display: -webkit-box; // 弹性伸缩盒
  -webkit-box-orient: vertical; // 设置伸缩盒子元素排列方式
}

/* 中划线 */
.line-through {
  text-decoration: line-through;
}


/* br60 */
.br60 {
  border-radius: 60rpx;
}

/* 初始化按钮 */
page button {
  margin: 0;
  background-color: transparent;
  font-weight: normal;
  font-size: 28rpx;
  overflow: unset;
	padding: 0;
}

page button::after {
  border: none;
}
input {
}
/* 按钮大小 */
button {
	&[disabled] {
		background-color: #ccc;
	}
	&.primary {
		background-color: $-color-theme;
		color: #fff;
	}
	&.block {
		width: 100%;
	}
	&.round {
		border-radius: 200px;
	}
}


.img-null {
  width: 300rpx;
  height: 300rpx;
}

.u-image image {
  display: block;
}

/* 隐藏滚动条 */
::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
}


.normal {
  text-align: center;
  color: #999797;
  font-size: 24rpx;
  padding: 24rpx;
}

.card {
  background-color: #fff;
  border-radius: 24rpx;
  padding: 32rpx;
}
/deep/ .place {
	color: #ccc;
	font-size: 28rpx;
}
.form {
	.form-item {
		display: flex;
		height: 96rpx;
		line-height: 96rpx;
		position: relative;
		.form-label {
			position: relative;
			&.require {
				&:before {
					content: "*";
					color: red;
					top: 6rpx;
					position: relative;
				}
			}
		}
		.form-content {
			flex: 1;
			text-align: right;
			display: flex;
			justify-content: flex-end;
			align-items: center;
			input {
				width: 100%;
				height: 100%;
				text-align: right;
				flex: 1;
			}
			.suffix {
				&.iconfont, .iconfont {
					color: #ccc;
				}
				margin-left: 10rpx;
			}
		}
	}
}